﻿<!DOCTYPE html>
<html ng-app="scopesApp">
<head>
    <title></title>
    <link href="bootstrap/css/bootstrap.min.css" rel="stylesheet" />
    <script src="scripts/angular.min.js"></script>
    <script>
        angular.module("scopesApp", [])
        .controller("simpleCtrl", function ($scope, $rootScope) {
            $scope.sendData = function (value) {
                $rootScope.$broadcast("dataUpdated", { message: value });
            };
            $scope.$on("dataUpdated", function (event, args) {
                $scope.data = args.message;
            });
        })
    </script>
</head>
<body>
    <div class="container">
        <div class="well" ng-controller="simpleCtrl">
            <div class="form-group">
                <label>要发送的数据：</label>
                <input ng-model="data" class="form-control"/>
            </div>
            <button class="btn btn-primary" ng-click="sendData(data)">发送</button>
        </div>
        <div class="well" ng-controller="simpleCtrl">
            <div class="form-group">
                <label>接收到的数据：</label>
                <input ng-model="data" class="form-control" readonly/>
            </div>
        </div>
    </div>
</body>
</html>
